<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>运动ing</title>
  </head>
  <body>
    <div class="app-sporting">
      <p class="out">户外跑</p>
      <p class="f24">运动中</p>
      <span class="iconfont icon-music"></span>
      <span class="iconfont icon-install4"></span>
      <p class="number dpflex">
        <span id="miles">112</span>
        <i>公里</i>
      </p>

      <div class="GPS dpflex">
        <p>GPS信号度低, 数据精准度低</p>
        <span>····························</span>
        <span class="iconfont icon-position5"></span>
      </div>

        <div class="time-icon">
          <div class="icons">
            <i class="iconfont icon-mileage"></i>
            <span>配速</span>
          </div>
          <div class="icons">
            <i class="iconfont icon-times"></i>
            <span>用时</span>
          </div>
          <div class="icons">
            <i class="iconfont icon-fires"></i>
            <span>千卡</span>
          </div>
        </div>       
        <div class="time-num">
          <div>
            <span>--</span>
          </div>
          <div>
            <span id="updateTime"></span>
          </div>
         <div>
          <span id="calorie"></span>
         </div>
        </div>

      <div class="circle">
        <div class="stop">
          <span class="iconfont icon-stop"></span>
          <span class="stop-font">暂停</span>
        </div>
        <div class="key">
          <span class="iconfont icon-lock"></span>
        </div>
      </div>
    </div>
  </body>
</html>
